<!DOCTYPE html>
<html lang="en" style="height: 100%" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>预定汇率交易</title>
    <link rel="stylesheet" href="/bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" href="/bootstrap/css/bootstrap-table.min.css">
    <link rel="stylesheet" href="/font-awesome/css/font-awesome.css">
    <link rel="stylesheet" href="/css/plugins/morris/morris-0.4.3.min.css">
    <link rel="stylesheet" href="/js/plugins/gritter/jquery.gritter.css">
    <link rel="stylesheet" href="/css/animate.css">
    <link rel="stylesheet" href="/css/style.css">
    <link rel="stylesheet" href="/css/plugins/toastr/toastr.min.css">
    <style>
        /*定义类名为.thead-blue的样式*/
        .table .thead-blue th {
            color: #fff;
            background-color: #3195f1;
        }

        /*模态框导致页面偏移问题*/
        .modal-open {
            overflow-y: scroll;
        }

        #quoteTable tr {
            height: 60px;
        }

        #button tr {
            height: 80px;
        }

        label {
            margin-top: 10px;
        }

        .toast-center-center {
            top: 35%;
            left: 50%;
            margin-top: -30px;
            margin-left: -150px;
        }

    </style>
</head>
<body>
<div id="wrapper">
    <div id="page-wrapper" class="gray-bg dashbard-1">
        <div class="wrapper wrapper-content animated fadeInRight">
            <h2 style="margin-left: 160px"><strong>外汇合约(T+1&T+2)</strong></h2><br>
            <form class="forms-sample">
                <div class="form-group row">
                    <label for="customerNo" class="col-sm-1 col-form-label">客户号</label>
                    <div class="col-sm-3">
                        <input type="text" class="form-control" id="customerNo" onblur="checkCustomerNo()">
                    </div>
                </div>
                <div class="form-group row" style="margin-top: 30px">
                    <label for="customerName" class="col-sm-1 col-form-label">客户名</label>
                    <div class="col-sm-3">
                        <input type="email" class="form-control" id="customerName" readonly>
                    </div>
                </div>
                <div class="form-group row" style="margin-top: 30px">
                    <label for="buyCurrency" class="col-sm-1 col-form-label">买入货币</label>
                    <div class="col-sm-3">
                    <select class="form-control" id="buyCurrency" name="buyCurrency">
                        <option value="" selected></option>
                        <option th:each="curreny1List:${currenyMap}" th:value="${curreny1List.key}"
                                th:text="${curreny1List.value}"></option>
                    </select>
                    </div>
                </div>
                <div class="form-group row" style="margin-top: 30px">
                    <label for="sellCurrency" class="col-sm-1 col-form-label">卖出货币</label>
                    <div class="col-sm-3">
                    <select class="form-control" id="sellCurrency" name="sellCurrency" onblur="getRate()">
                        <option value="" selected></option>
                        <option th:each="curreny1List:${currenyMap}" th:value="${curreny1List.key}"
                                th:text="${curreny1List.value}"></option>
                    </select>
                    </div>
                </div>

                <div class="form-group row" style="margin-top: 30px">
                    <label for="costRate" class="col-sm-1 col-form-label">标准汇率</label>
                    <div class="col-sm-3">
                        <input type="number" class="form-control" id="costRate" step="0.00001" min="0" max="100.00000" readonly>
                    </div>
                </div>

                <div class="form-group row" style="margin-top: 30px">
                    <label for="acceptedBooKRate" class="col-sm-1 col-form-label">预定汇率</label>
                    <div class="col-sm-3">
                        <input type="number" class="form-control" id="acceptedBooKRate" step="0.00001" min="0" max="500.00000" onblur="checkAcceptedBooKRate()">
                    </div>
                </div>

                <div class="form-group row" style="margin-top: 30px">
                    <label for="buyAmount" class="col-sm-1 col-form-label">进账金额</label>
                    <div class="col-sm-3">
                        <input type="number" class="form-control" id="buyAmount" step="0.01" min="0" max="999999999.99" onblur="populateSellAmount()">
                    </div>
                </div>


                <div class="form-group row" style="margin-top: 30px">
                    <label for="sellAmount" class="col-sm-1 col-form-label">出账金额</label>
                    <div class="col-sm-3">
                        <input type="number" class="form-control" id="sellAmount" step="0.01" min="0" max="999999999.99" onblur="populateBuyAmount()">
                    </div>
                </div>

                <div class="form-group row" style="margin-top: 30px">
                    <label for="settlementDate" class="col-sm-1 col-form-label">结算日期</label>
                    <div class="col-sm-3">
                        <input type="date" class="form-control" id="settlementDate" name="settlementDate">
                    </div>
                </div>

                <div class="form-check form-check-flat form-check-primary">
                    <button type="button" class="btn btn-primary mr-2" style="margin-left: 200px;margin-top: 10px" onclick="sendContract()">提交</button>
                    <button class="btn btn-danger" style="margin-left: 10px;margin-top: 10px">取消</button>
                </div>

            </form>
        </div>
    </div>
</div>

<script src="/js/jQuery.min.js"></script>
<script src="/js/plugins/toastr/toastr.min.js"></script>
<script src="/bootstrap/js/bootstrap.min.js"></script>
<script src="/bootstrap/js/bootstrap-editable.js"></script>
<script src="/bootstrap/js/bootstrap-table.min.js"></script>
<script src="/bootstrap/js/bootstrap-table-zh-CN.js"></script>
<script src="/js/plugins/metisMenu/jquery.metisMenu.js"></script>
<script src="/js/plugins/slimscroll/jquery.slimscroll.min.js"></script>
<script src="/js/hplus.js?v=2.2.0"></script>
<script src="/js/plugins/pace/pace.min.js"></script>
<script src="/js/contract.js"></script>
<script src="/js/index.js"></script>

</body>

</html>
